<template>
  <div class="layout-min-full-height">
    <div class="pc-model">
      <section class="py-8 section_state state_recommend animetext">
        <div class="container">
          <div id="triggerBlur"></div>
          <div class="row">
            <div class="col-12">
              <div class="bb_qgency_state position-relative">
                <div class="number_state"><h5 class="text-muted">总推荐景点数</h5>
                  <div class="txt">
                    61
                  </div>
                </div>
                <div class="blur_item"></div>
                <div class="content_state"><h1 class="fw-600">推荐景点 - 分享与快乐</h1>
                  <p class="fs-18 text-muted">
                    如果您发现了精彩的景点，可以在这儿提交与大家分享
                  </p></div>
                <div class="app-random">
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/adobe-photoshop-2020-1.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/downie-4.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/xmin-zen.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/app-cleaner-7.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/sketch-1.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/imazing-1.png">-->
<!--                  <img src="https://static.konlonair.com/public/uploads/_/originals/movist-1.png">-->
                </div>
                <div class="link_state">
                  <button class="btn btn-theme btn-round px-7 btn-recommend">立即推荐</button>
                  <a href="/feedback" class="btn btn-round px-6 btn_xl_primary btn_touch rounded-8"><img
                    src="https://static.facebstore.com/public/uploads/_/originals/1f607.png">
                    意见建议
                  </a></div>
              </div>
            </div>
          </div>
        </div>
      </section>
      <div class="container">
        <div class="w-r" style="margin-left: -25px; margin-right: -25px;">
          <div class="w-c w-c-12" style="padding-left: 25px; padding-right: 25px; padding-bottom: 50px;"><h4
            class="fw-600 mb-5">待上架 <span class="fs-18 ml-3 text-muted">(423)</span></h4>
            <div class="mobile-layout">
              <div class="grid-list px-0">
                <div class="list-animation-leftIn delay-0">
                  <a class="macwk-app border white cursor-pointer mb-0 px-6">
                    <div class="macwk-app__header--icon" style="--color:#a24916;">
                      <div class="macwk-app__header--icon--content"></div>
                      <div class="color-fill-icon w-50 h-50 circle d-flex align-items-center">
                        <div aria-hidden="true" class="vue-avatar--wrapper"
                             style="display: flex; width: 50px; height: 50px; border-radius: 50%; font: 20px / 50px Helvetica, Arial, sans-serif; align-items: center; justify-content: center; text-align: center; user-select: none; background-color: rgb(76, 175, 80); color: rgb(255, 255, 255);">
                          <span>1</span></div>
                      </div>
                    </div>
                    <div class="macwk-app__body"><p class="macwk-app__body--version text-truncate"><span>2.4.5</span>
                    </p>
                      <h5 class="macwk-app__body--title"
                          style="display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; text-overflow: ellipsis; -webkit-line-clamp: 1;">
                        <span>测试待上架</span> <span class="macwk-app__body--title--version text-muted fs-14"><span
                        class="mx-1">-</span></span></h5>
                      <p class="macwk-app__body--info"
                         style="display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; text-overflow: ellipsis; -webkit-line-clamp: 1;">
                        红色经典
                      </p>
                    </div>
                    <div class="macwk-app__footer">
                      <div class="macwk-app__footer--more"><i class="light-icon-more icon-next-arrow"></i></div>
                    </div>
                  </a>
                </div>
              </div>
              <div class="el-loading-mask" style="display: none;">
                <div class="el-loading-spinner">
                  <svg viewBox="25 25 50 50" class="circular">
                    <circle cx="50" cy="50" r="20" fill="none" class="path"></circle>
                  </svg>
                </div>
              </div>
            </div>
            <el-pagination
              :page-size="20"
              :pager-count="5"
              layout="prev, next"
              :total="1000">
            </el-pagination>
          </div>
          <div class="w-c w-c-12" style="padding-left: 25px; padding-right: 25px; padding-bottom: 50px;"><h4
            class="fw-600 mb-5">已上架 <span class="fs-18 ml-3 text-muted">(113)</span></h4>
            <div class="mobile-layout">
              <div class="grid-list px-0">
                <div class="list-animation-leftIn delay-0">
                  <a href="/soft/START" target="_blank"
                     class="macwk-app border white cursor-pointer mb-0 px-6">
                    <div class="macwk-app__header--icon">
                      <div class="macwk-app__header--icon--content"
                           ></div>
                      <img class="delay-0"
                           data-src="https://static.facebstore.com/public/uploads/_/originals/start-1.png"
                           src="https://static.facebstore.com/public/uploads/_/originals/start-1.png" lazy="loaded">
                    </div>
                    <div class="macwk-app__body">
                      <h5 class="macwk-app__body--title"
                          style="display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; text-overflow: ellipsis; -webkit-line-clamp: 1;">
                        <span>避暑山庄</span> <span class="macwk-app__body--title--version text-muted fs-14"><span
                        class="mx-1">-</span>0.298.3</span></h5>
                      <p class="macwk-app__body--info"
                         style="display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; word-break: break-all; text-overflow: ellipsis; -webkit-line-clamp: 1;">
                        皇家避暑胜地
                        <span class="fs-12 opacity-80 ml-1"> - <span class="ml-1">112.8 MB</span></span></p></div>
                    <div class="macwk-app__footer">
                      <div class="macwk-app__footer--more">
                        <i class="light-icon-more icon-next-arrow"></i></div>
                    </div>
                  </a>
                </div>
              </div>
              <div class="el-loading-mask" style="display: none;">
                <div class="el-loading-spinner">
                  <svg viewBox="25 25 50 50" class="circular">
                    <circle cx="50" cy="50" r="20" fill="none" class="path"></circle>
                  </svg>
                </div>
              </div>
            </div>
            <el-pagination
              :page-size="20"
              :pager-count="5"
              layout="prev, next"
              :total="1000">
            </el-pagination>
          </div>
        </div>
      </div>
    </div>
    <div class="mobile-model">
      <div class="d-flex layout-min-full-height justify-content-center align-items-center">
        <div class="text-center" style="width: 80%; margin: 0px auto;"><h1 class="mb-4">哇，窗口太小啦</h1>
          <p class="mb-6">请调整浏览器窗口大小或者请使用手机查看！</p></div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  mounted() {
  },
  methods: {}
};
</script>

<style scoped>
/*@import "../../assets/css/zt.css";*/
/*@import "https://static.facebstore.com/FlyCat-client/css/7343d4b.css";*/
</style>
